{% extends "base_site.html" %} {% block title %} Geographical View {% endblock title %}
{% block stylesheets %} {{ super() }}
<link
  href="{{ url_for('static', filename='lib/leaflet/leaflet.min.css') }}"
  rel="stylesheet"
/>
<link
  href="{{ url_for('static', filename='lib/leaflet-markercluster/leaflet.markercluster.min.css') }}"
  rel="stylesheet"
/>
<link
  href="{{ url_for('static', filename='css/visualization.css') }}"
  rel="stylesheet"
/>
{% endblock stylesheets %} {% block content %}
<form id="search-form-device" class="overlay"></form>
<form id="search-form-link" class="overlay"></form>
<div id="map"></div>
<ul id="contextMenu" oncontextmenu="return false;" class="dropdown-menu" role="menu">
  <li class="menu dropdown-submenu geo-menu">
    <a class="menu-submenu" tabindex="-1" href="#"
      >Type of View<span class="caret-right"></span
    ></a>
    <ul class="dropdown-menu">
      <li><a tabindex="-1" href="#">Normal</a></li>
      <li><a tabindex="-1" href="#">Clustered</a></li>
    </ul>
  </li>
  <li class="menu dropdown-submenu geo-menu">
    <a class="menu-submenu" tabindex="-1" href="#"
      >Tile layer<span class="caret-right"></span
    ></a>
    <ul class="dropdown-menu">
      <li><a tabindex="-1" href="#">Open Street Map</a></li>
      <li><a tabindex="-1" href="#">Google Maps</a></li>
    </ul>
  </li>
  <li class="menu dropdown-submenu geo-menu">
    <a class="menu-submenu" tabindex="-1" href="#"
      >Type of Marker<span class="caret-right"></span
    ></a>
    <ul class="dropdown-menu">
      <li><a tabindex="-1" href="#">Image</a></li>
      <li><a tabindex="-1" href="#">Circle</a></li>
      <li><a tabindex="-1" href="#">Circle Marker</a></li>
    </ul>
  </li>
  <li class="menu rc-object-menu rc-plan-menu rc-device-menu rc-link-menu rc-site-menu">
    <a tabindex="-1" href="#">Properties</a>
  </li>
  <li class="menu rc-object-menu rc-device-menu">
    <a tabindex="-1" href="#">Connect</a>
  </li>
  <li class="menu rc-object-menu rc-device-menu">
    <a tabindex="-1" href="#">Configuration</a>
  </li>
  <li class="menu rc-object-menu rc-device-menu">
    <a tabindex="-1" href="#">Results</a>
  </li>
  <li class="menu rc-object-menu rc-device-menu">
    <a tabindex="-1" href="#">Run Service</a>
  </li>
</ul>
<div class="controls">
  <nav class="navbar navbar-default navbar-custom navbar-color" role="navigation">
    <div style="margin: 0px;">
      <select
        id="current-pool"
        class="form-control"
        data-dropdown-align-right="true"
        data-size="20"
        data-width="305px"
      ></select>
    </div>
    <ul class="pagination" style="margin: 0px; padding-top: 5px;">
      <li>
        <a
          onclick="action['Edit Pool']()"
          data-tooltip="Edit Pool"
          style="cursor: pointer;"
          ><span class="glyphicon glyphicon-edit cursor"></span
        ></a>
      </li>
      <li>
        <a
          onclick="eNMS.base.showInstancePanel('device', null, 'bulk-filter')"
          data-tooltip="Device Filtering"
          style="cursor: pointer;"
          ><span class="glyphicon glyphicon-equalizer"></span
        ></a>
      </li>
      <li>
        <a
          onclick="eNMS.base.showInstancePanel('link', null, 'bulk-filter')"
          data-tooltip="Link Filtering"
          style="cursor: pointer;"
          ><span class="glyphicon glyphicon-random"></span
        ></a>
      </li>
      <li>
        <a
          onclick="eNMS.visualization.displayNetwork({})"
          data-tooltip="Refresh"
          style="cursor: pointer;"
          ><span class="glyphicon glyphicon-refresh"></span
        ></a>
      </li>
      <li>
        <a
          onclick="eNMS.visualization.clearSearch()"
          data-tooltip="Clear Search"
          style="cursor: pointer;"
          ><span class="glyphicon glyphicon-remove"></span
        ></a>
      </li>
      <li>
        <a
          onclick="eNMS.automation.showRunServicePanel({type: 'device'})"
          data-tooltip="Run service on all currently displayed devices"
          style="cursor: pointer;"
          ><span class="glyphicon glyphicon-play"></span
        ></a>
      </li>
      <li id="left-arrow">
        <a
          onclick="action['Backward']()"
          data-tooltip="Previous View"
          style="cursor: pointer;"
          ><span class="glyphicon glyphicon-chevron-left"></span
        ></a>
      </li>
      <li id="right-arrow">
        <a
          onclick="action['Forward']()"
          data-tooltip="Next View"
          style="cursor: pointer;"
          ><span class="glyphicon glyphicon-chevron-right"></span
        ></a>
      </li>
    </ul>
  </nav>
</div>
{% endblock content %} {% block javascripts %} {{ super()}}
<script src="{{ url_for('static', filename='lib/leaflet/leaflet.min.js') }}"></script>
<script src="{{ url_for('static', filename='lib/leaflet-markercluster/leaflet.markercluster.min.js') }}"></script>
{% endblock javascripts %}
